import app from '../plugins/index'

// app.use()
// app.component
// v-highlight

app.directive('highlight', {
  // 钩子函数 mounted
  beforeMount(el, binding, vnode) {
    console.log('binding: ', binding, 'el:', el, 'vnode:', vnode)
    el.style.background = binding.value
  },
  mounted(el) {
    console.log('e:', el)
    observer(el)
    // window.addEventListener('scroll', () => {
    //   // console.log('e:', el.getBoundingClientRect())
    //   const rect = el.getBoundingClientRect()
    //   if (rect.top === 0) {
    //     console.log('顶部')
    //     // el
    //   }
    // })
  }
})

function observer(el: HTMLElement) {
  //
  const io = new IntersectionObserver((entries) => {
    console.log(entries)
  })
  // 开始观察
  io.observe(el)

  // // 停止观察
  // io.unobserve(element)

  // // 关闭观察器
  // io.disconnect()
}

app.directive('fixed', {
  // 钩子函数 mounted
  // beforeMount(el, binding, vnode) {
  //   // console.log('binding: ', binding, 'el:', el, 'vnode:', vnode)
  //   // el.style.background = binding.value
  // },
  mounted(el, binding, vnode) {
    console.log('e:', el)
    // IntersectionObserver(el)
  }
})
